import { useEffect, useState } from 'react'
import { Swiper } from 'antd-mobile'
import '../../style/home/swiper.scss'
import { banner } from '../../apis/home'

interface Props{

}
interface SwiperItem {
  alt: String,
  bannerid: String,
  flag: Boolean,
  img: String,
  link: String
}
export default function MySwiper(props:Props) {

  const [swiper, setswiper] = useState<Array<SwiperItem>>([])
  // const [swiper, setswiper] = useState<Swiperlist>()
  useEffect(() => {
    banner().then((ok) => {

      setswiper(ok.data);
      // console.log(ok.data);
      
    })
  }, [])

  return (
    <div className='swiper'>
      <Swiper autoplay loop>
        {
          swiper.map((item:any, index:number) => {
            return (
              <Swiper.Item key={index}>
                <img src={item.img} alt="" />
              </Swiper.Item>
            )
          })
        }
      </Swiper>
    </div>
  )
}
